<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        /*  1.调用show函数，并把fn作为参数传入show函数
                            2.此时，好像变成了
                            		function show(f) {
                                        var x= 20;
                                        function fn() {
                                        console.log(x)
                                      }
                                    }
                            3.乍一看结果就是20，其实结果是10
                            4.每个函数都有自己独立的执行环境，在代码编译完成的时候就确定了自己的作用域。
                            卡住你的点就在于show函数的形参是一个函数，fn函数传进去的话好像变成show的一个子函数了，
                            其实不是的，你可以理解为请fn来帮忙，那fn还是以自己的风格做事。虽然fn被show调用了，
                            但还是在自己的执行环境（作用域）里行动的。

                        */
        var x = 10;

        function fn() {
            console.log(x)
        }

        function show(f) {
            var x = 20;
            f();
        }
        show(fn); // 10
        // 原型链的查找是按照函数定义时的位置开始查找，与函数调用位置无关、
    </script>
</body>

</html>